<template>

  <div class="main">
    <h1 style="text-align: center; margin-top: 0px; margin-bottom: 50px;">药房开单</h1>
    <el-form ref="form" :model="form" label-width="80px" class="input" style="margin-right: 100px">
      <el-form-item label="病人姓名">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
      <el-form-item label="联系电话">
        <el-input v-model="form.mobile" @blur="judge"></el-input>
      </el-form-item>
      <el-form-item label="开单药师">
        <el-input v-model="form.doctorName" disabled></el-input>
      </el-form-item>
      <el-form-item>
        <el-transfer
            style="text-align: left; display: inline-block"
            :titles="['药品', '清单']"
            filterable
            v-model="value"
            :props="{key: 'value',label: 'desc'}"
            :data="data">
          <el-button class="transfer-footer" slot="right-footer" size="small" @click="count">确定</el-button>
        </el-transfer>
      </el-form-item>
      <el-form-item label="清单总价">
        <el-input type="text" v-model="form.total_price" style="width: 100px; display: block"></el-input>
      </el-form-item>
      <el-form-item label="注意事项">
        <el-input type="textarea" v-model="form.desc"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">创建清单</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import router from "../../router";

export default {
  data() {
    return {
      form: {
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: '',
        total_price: '',
        doctorName: '',
        mobile: '',
      },
      data: [],
      value: [],
      init_data: [],
    };
  },
  created() {
    this.form.doctorName = this.$getSessionStorage('user').name
    let panduan = []
    console.log('开始，这里？？')
    // this.$axios.get(this.$settings.BASE_URL + 'user/get_medicine/').then(response => {
    this.$axios.get(`${this.$settings.BASE_URL}user/get_medicine/`).then(response => {
      console.log(response.data)  // 拿到的是列表套字典--->[{name, total}, {name, total}, {name, total}]
      console.log('我在这哦')
      for (let bool of response.data) {
        if (bool.is_ground === true) {
          panduan.push(bool)
        }
      }
      this.init_data = panduan
      // console.log(panduan[i].id, '--kkk这里01')
      // console.log(panduan[i].name, '--kkk这里02')
      for (let i = 0; i < panduan.length; i++) {  // 7
        this.data.push({
          value: panduan[i].id,
          desc: panduan[i].name,
        });
      }
    })
  },
  methods: {
    count() {
      console.log(this.value)  // 索引值[4，5]
      // console.log(this.init_data)  // [{id, total, price}, {name, total, price}, {name, total, price}]
      let init = 0
      for (let dict of this.init_data) {  // 拿到选择的药品id
        for (let index of this.value) {  // 去到每一个字典
          if (dict.id === index) {
            init += Number(dict.price)
          }
        }
      }
      this.form.total_price = init + ' ' + '￥'
    },
    judge() {
      if (this.form.name.length === 0 || this.form.mobile.length === 0) {
        this.$message({
          message: '请填写姓名或手机号',
          type: 'warning',
          duration: 1000
        })
      } else {
        // this.$axios.post(this.$settings.BASE_URL + 'patient/query_user/query_user/', {
        this.$axios.post(`${this.$settings.BASE_URL}patient/query_user/query_user/`, {
          'name': this.form.name,
          'mobile': this.form.mobile
        }).then(response => {
          if (response.data.code === 100) {
            this.$message({
              message: response.data.msg,
              type: 'success',
              duration: 1000
            })
          } else {
            this.$message({
              message: response.data.msg,
              type: 'warning',
              duration: 1000
            })
          }
        })
      }

    },
    onSubmit() {
      // alert(this.form.total_price.split(' ')[0])
      // this.$axios.post(this.$settings.BASE_URL + 'registered/detailed_list/', {
      this.$axios.post(`${this.$settings.BASE_URL}registered/detailed_list/`, {
        patient_name: this.form.name,
        doctor_name: this.form.doctorName,
        mobile: this.form.mobile,
        total_price: this.form.total_price.split(' ')[0],
        careful_note: this.form.desc,
        medicine: this.value,
      }).then(response => {
        this.$message({
          message: '药单创建成功',
          type: 'success',
          duration: 1000
        })
        window.setTimeout(function () {
          router.push({path: '/index/paymentPlatform'})
        }, 1000)
      })
    }
  }
};
</script>

<style scoped>
.main {
  margin-top: 10px;
  text-align: center;
  width: 800px;
  margin-left: 250px;
}

.transfer-footer {
  margin-left: 20px;
  padding: 6px 5px;
}

.input {
  margin-top: 15px;
}
</style>